// 自定义webkit滚动条样式
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}

::-webkit-scrollbar-track {
  background-color: #fbfbfb !important;
  border-radius: 5px;
}

::-webkit-scrollbar-thumb {
  background: #cacaca !important;
  border-radius: 5px;
}

.ScrollbarsCustom-Track {
  height: 7px !important;
}

.ant-layout-header {
  height: 50px !important;

  .ant-pro-global-header {
    position: relative;
    height: 100%;
  }

  .ant-pro-global-header-trigger {
    position: relative;
    display: inline-block;
    width: 80px;
    height: 100%;
    padding: 0;

    i {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
  }

  .antd-pro-components-global-header-index-right {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .antd-pro-components-global-header-index-action {
    line-height: 50px;
  }
}

.ant-layout-content .fade-transform {
  animation-duration: 0.3s;
  animation-fill-mode: both;
}

@keyframes fade-transform-enter {
  from,
  70%,
  80%,
  85%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    //transform: translate3d(300px, 0, 0);
    transform: translateX(300px);
    opacity: 0;
  }

  70% {
    //transform: translate3d(-6px, 0, 0);
    transform: translateX(-6px);
    opacity: 1;
  }

  80% {
    //transform: translate3d(2px, 0, 0);
    transform: translateX(2px);
  }

  85% {
    transform: translateX(0);
  }
}

@keyframes fade-transform-leave {
  20% {
    transform: translate3d(-20px, 0, 0);
    opacity: 1;
  }

  to {
    transform: translate3d(2000px, 0, 0);
    opacity: 0;
  }
}

.fade-transform-leave {
  display: none;
  animation-name: fade-transform-leave;
}

.fade-transform-enter {
  display: block;
  animation-name: fade-transform-enter;
}

.page-mobile {
  .fade-transform-leave {
    animation-name: none;
  }

  .fade-transform-enter {
    animation-name: none;
  }
}

.mb0 {
  margin-bottom: 0 !important;
}

.st-card p {
  margin-bottom: 0;
}
